<template>
  <card title="菜单">
    <y-table-full 
      v-bind="fullOptions"
      ref="$treeTable"
      @add="addHandler"
      @edit="editHandler"
      @delete="deleteHandler"
      @load="load"
      @search="searchHandler"
      ></y-table-full>
  </card>
</template>

<script>
export default {
  data() {
    return {
      fullOptions: {
        // 过滤配置
        filter: [
          { type: "input", field: "keyword", placeholder: "请输入关键字"},
        ],
        // CRUD等配置
        operation: {
          btns: ["add", "edit", "delete"],
          more: ["audit"],
        },
        // 表格配置
        table: {
          url: "/api/menu/children/",
          type: "tree",
          columns: [
            { type: "seq", width: 50 },
            { field: "name", title: "名称", treeNode: true },
            { field: "type", title: "类型" },
            { field: "routePath", title: "路由", showOverflow: true },
            { field: "routeComponent", title: "视图", showOverflow: true },
            { field: "routeRedirect", title: "重定向", showOverflow: true },
          ],
          data: [],
        },
      },
    };
  },
  created() {
    this.init();
  },
  methods: {
    init() {
      this.load({ id: "0" });
    },
    async load(row, callback) {
      var { data } = await $y.api.system.menu.getChildren(row.id);
      this.fullOptions.table.data = data;
    },
    /**
     * 添加
     */
    addHandler(event,next) {
      var { api } = this.$refs.$treeTable;
      var { id } = api.getCurrentRecord() || {};
      next({ parentId: id });
    },
    /**
     * 编辑
     */
    editHandler(event,next) {
      var { api } = this.$refs.$treeTable;
      var { id } = api.getCurrentRecord() || {};
      next({ keyValue: id });
    },
    /**
     * 删除
     */
    async deleteHandler() {
      var { api } = this.$refs.$treeTable;
      var { id } = api.getCurrentRecord() || {};
      var { succeeded } = await this.$y.api.system.menu.remove(id);
      succeeded && api.remove(api.getCurrentRecord())
    },
    /**
     * 查询
     */
    async searchHandler(params) {
      var { data } = await $y.api.system.menu.getChildren('0');
      this.fullOptions.table.data = data;
    },
  },
};
</script>

<style lang="scss" scoped>
</style>